<!--  -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://www.backbase.com/bjs/core" prefix="bjs"%>

<f:view>
	<html xmlns="http://www.w3.org/1999/xhtml"
		xmlns:b="http://www.backbase.com/b"
		xmlns:s="http://www.backbase.com/s">

	<head>
	<bjs:boot var="bootDir" />
	</head>

	<body style="margin:15px" onload="bpc.boot()">

	<bjs:application skin="backbase">

		<bjs:detailViewer>
			<bjs:propertyItem itemLabel="Username">
				<bjs:inputText id="username" value="#{user.name}" />
			</bjs:propertyItem>
			<bjs:propertyItem itemLabel="Password">
				<bjs:inputSecret id="password" value="#{user.password}">
					<f:validateLength minimum="4" />
				</bjs:inputSecret>
			</bjs:propertyItem>
		</bjs:detailViewer>


		<br />
		<br />

		<bjs:message for="password" errorStyle="color:red" />
		<br />
		<bjs:commandButton value="Login" action="#{login.doLogin}" />

		<br />
		<br />

		<bjs:box show="#{user.authError!=null}">
			<bjs:outputText style="color:red" value="#{user.authError}" />
		</bjs:box>

		<bjs:commandButton id="button001"
			binding="#{backingBean.button1}"
			value="#{backingBean.button1Title}"
			action="#{backingBean.addTwoNumbers}" />
	
		<bjs:commandButton id="button002" value="Backbase Image Button"
			image="backbase_logo_20.gif">
			<f:verbatim>
				<s:event b:on="click">
					<s:task b:action="alert" b:value="Hi!" />
				</s:event>
			</f:verbatim>
		</bjs:commandButton>
		
		<bjs:box>
			Result of adding two numbers on the server: <bjs:outputText id="calcoutput" style="color:red" binding="#{backingBean.calcoutput}"></bjs:outputText>
		</bjs:box>

	</bjs:application>
	</body>

	</html>
</f:view>
